﻿@using MyWEbProject.Models;
@{
    ViewBag.Title = "CustomerView";
    //List<Customers> customers = ViewData["MY.CUSTOMER.LIST"] as List<Customers>;
    //Layout = null;
}

<h2>Customer View to change data</h2>



@*@if (customers != null && customers.Count > 0) { 
    for (int i = 0; i < customers.Count; i++)
    {
        Customers customer = customers[i];
        <div style="margin-top:10px;margin-bottom:10px;">
            <div><strong>Customer ID:</strong> @customer.ID <INPUT TYPE=CHECKBOX NAME="customer"><button onclick="location.href='/Home/EditCustomer'">Edit</button></div>
            <div><strong>Customer Name:</strong> @customer.Name</div>
        </div>
    }
    <form method="link" action="/Home/EditCustomer">
        <input type="submit" value="Edit">
    </form>    
}*@

<table>
    <tr>
        <td>Name</td>
        <td>Address</td>
        <td>Age</td>
        <td>Profession</td>
        <td>Created on</td>
    </tr>
    @foreach (var item in ViewBag.ModelDetails)
    {
        <tr id="@item.ID">
            <td>@item.Name</td>
            
            <td>@item.Address</td>
            <td>@item.Age</td>
            <td>@item.Profession1.Name</td>
            <td>@item.Created_on</td>
            
            <td>
                @Html.ActionLink("Edit", "Edit", new { id = item.ID}) 
            </td>
            <td>
                <input type="hidden" name="txtID" value=@item.ID />
                <button onclick="SendAjaxRequest('@item.ID');"> Delete </button>

                @*<input type="hidden" id="textID" value=@item.ID />
                <button onclick="SendAjaxRequest();"> Delete </button>*@
               
               
                
            </td>
         </tr>
    }
</table>

<form  method="post"> @Html.ActionLink("Create new", "Edit", new { id = 0}) 
</form>

@*@foreach (var item in ViewBag.ModelDetails)
{
    <div>Name @item.Name</div>
    <div>Address @item.Address</div>
    <div>Age @item.Age</div>
    
    
}*@

<div></div><br />
<button value="Test JSON" type="button" onclick="GetAllCustomers();">Test JSON</button>
<div id="divCustomerList"></div>
<table id="table_show"></table>



<script language="javascript" type="text/javascript">

    function SendAjaxRequest(id) {

        //var id = document.getElementsByName('textID').value


        var customer_id = id
        //alert(customer_id);


        var xmlhttp;

        if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
            //alert("NON IE");
            xmlhttp = new XMLHttpRequest();
        }
        else {// code for IE6, IE5
            //alert("IE")
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }



        xmlhttp.open("GET", "/Home/DeleteCommand?C_ID="+customer_id, true);


        xmlhttp.send();


        xmlhttp.onreadystatechange = function () {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById(id).innerHTML = "";
                document.getElementById('jsonCustomer' + id).innerHTML = "";
                //alert('Server Response Is: ' + xmlhttp.responseText);
            }
        }
    }




    function Ajax(url, method, func) {
        var xmlhttp;
        if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        }
        else {// code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = func;
        //alert(customer_id);
        //xmlhttp.onreadystatechange = function () {
        //    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        //        document.getElementById("delete_text").innerHTML = xmlhttp.responseText;
        //        document.getElementById('trCustomerRow_' + customer_id).style.display = 'none';//.innerHTML = "";
        //        //alert('Server Response Is: ' + xmlhttp.responseText);
        //    }
        //}

        xmlhttp.open("POST", "/Home/DeleteCustomer?C_ID=" + customer_id, true);
        //xmlhttp.open(method, url, true);
        xmlhttp.send();
    }
    function GetAllCustomers() {
        var xmlhttp;
        if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        }
        else {// code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        //alert(customer_id);
        xmlhttp.onreadystatechange = function () {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                BuildCustomerList(xmlhttp.responseText);
                //document.getElementById('trCustomerRow_' + customer_id).style.display = 'none';//.innerHTML = "";
                //alert('Server Response Is: ' + xmlhttp.responseText);
            }
        }

        xmlhttp.open("POST", "/Home/GetAllCustomers", true);
        xmlhttp.send();
    }

    function BuildCustomerList(customerJson) {
        var customers = eval('(' + customerJson + ')');
        var html = '<table id="table_show"><tr><td>Name</td><td>Address</td><td>Age</td><td>Profession</td><td>Created on</td></tr>';
        for (var i = 0; i < customers.length; i++) {
            var customer = customers[i];
            
            html += '<tr id="jsonCustomer' + customer.ID + '" ><td>' + customer.Name + '</td><td>' + customer.Address + '</td><td>' + customer.Age + '</td><td>' + customer.Profession1.Name + '</td><td>' + customer.Created_on + '</td>';
            html += '<td><a href="/Home/Edit/' + customer.ID + '">Edit</a></td><td><button onclick="SendAjaxRequest(' + customer.ID + ')"> Delete </button></tr>'
            
        }


        html += '</table>';
        html += '<td><a href="/Home/Edit/' + 0 + '">Edit</a></td>'

        var divCustomerList = document.getElementById("divCustomerList")
        divCustomerList.innerHTML = html;
    }


  

</script>


